<!doctype html>
<html class="no-js">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>通道资料认证</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-title" content="Amaze UI" />
    <meta name="msapplication-TileColor" content="#0e90d2">
    <link rel="stylesheet" href="assets/css/amazeui.min.css">
    <link rel="stylesheet" href="assets/css/app.css">
    <link rel="stylesheet" href="css/app.css" />
    <style>
        input[type="number"] {
            -moz-appearance: textfield;
        }

        /**橙色字体
		 * */

        .text-ora {
            color: #41A0F0;
        }

        /**橙色背景
		 * */

        .bg-ora {
            background: #0165C7;
            color: #fff;
        }

        /**淡蓝字体
		 * */

        .text-sky {
            color: #00aaee;
        }

        .h40 {
            height: 40px;
            line-height: 38px;
            color: #333;
        }

        label {
            display: inline-block;
            margin-bottom: 0;
            font-weight: 500;
        }

        p {
            margin: 0;
        }

        .h45 {
            height: 45px;
            line-height: 45px;
            padding: 0 12px;
            font-size: 12px;
        }

        .white_bg {
            background: white;
            color: #B6B5BB;
        }

        .idCard_main {
            font-size: 14px;
        }

        .cardLists {
            display: flex;
            justify-content: space-between;
            flex-flow: wrap;
            padding: 10px 12px;
        }

        .cardLists>li {
            width: 85%;
            background: white;
            margin: 10px auto;
        }

        .cardLists label {
            position: relative;
            width: 100%;
        }

        .cardLists label p {
            position: absolute;
            bottom: 0;
            width: 100%;
            height: 25px;
            line-height: 25px;
            text-align: center;
            font-size: 12px;
            background: rgba(0, 0, 0, .4);
            color: white;
        }

        .cardLists img {
            width: 100%;
            height: 185px;
        }

        .submit_rz {
            width: 100%;
            height: 5rem;
            line-height: 5rem;
            text-align: center;
            background: #0569CB;
            margin-top: 4rem;
        }

        .submit_rz>a {
            color: white;
        }
    </style>
</head>

<body style="background: #f8f8f8;">
    <!-- 页面内容 开发时删除 -->
    <header class="am-u">
        <div class="am-u-sm-12 head_nav" style="margin:0;">
            <div class="am-u-sm-2 am-vertical-align">
                <a href="channels.html">
                    <img src="img/return@2x.png" class="am-vertical-align-middle" alt="" />
                </a>
            </div>
            <div class="am-u-sm-8 head_text">
                通道资料认证
            </div>
            <div class="am-u-sm-2">

            </div>
        </div>
    </header>
    <div style="clear: both;"></div>

    <div class="idCard_main">
        <p class="h45 white_bg">
            使用该通道需先上传如下资料，请分别按照要求上传
        </p>
        <ul class="cardLists">
            <li>
                <form id="form1" method="post" enctype="multipart/frm-data">
                    <label>
                        <img src="img/sfzzm.png" alt="身份证正面" class="type_img_1">
                        <input type="file" name="file" style="display:none;" class="type_1">
                        <p>身份证正面
                            <span style="color:red;">(必填)</span>
                        </p>
                    </label>
                </form>
            </li>
            <li>
                <form id="form2" method="post" enctype="multipart/frm-data">
                    <label>
                        <img src="img/sfzfm.png" alt="身份证反面" class="type_img_2">
                        <input type="file" name="file" style="display:none;" class="type_2">
                        <p>身份证反面
                            <span style="color:red;">(必填)</span>
                        </p>
                    </label>
                </form>
            </li>
        </ul>
        <div class="white_bg" style="padding:12px;">
            注：手持银行卡及身份证为：两手各持银行卡正面、身份证正面与本人的上半身合照
        </div>
    </div>

    <div class="submit_rz">
        <a href="javascript:;">提交认证</a>
    </div>

    <!--[if (gte IE 9)|!(IE)]><!-->
    <script src="assets/js/jquery.min.js"></script>
    <!--<![endif]-->
    <script src="assets/js/amazeui.min.js"></script>
    <script>
        var token = sessionStorage.getItem("token");
        $('.type_1').on("change", function () {
            doUpload(1);
        })
        $('.type_2').on("change", function () {
            doUpload(2);
        })
        // $('.type_3').on("change", function () {
        //     doUpload(3);
        // })
        // $('.type_4').on("change", function () {
        //     doUpload(4);
        // })

        function doUpload(a) {
            var formData = new FormData($("#form" + a)[0]);
            formData.append("token", token);
            formData.append("type", "1");
            formData.append("method", "file_upload");
            $.ajax({
                url: 'http://www.rice.com/app/api/h5_access',
                type: 'POST',
                data: formData,
                async: false,
                cache: false,
                contentType: false,
                processData: false,
                dataType: "json",
                success: function (result) {
                    if (result.status == "1") {
                        alert(result.message);
                        $(".type_img_" + a).attr("src", result.data.img_url);
                    } else {
                        alert(result.message);
                    }
                }
            })
        }

        $(".submit_rz>a").on("click", function () {
            console.log($('.type_img_1').attr("src"));
            console.log($('.type_img_2').attr("src"));
            var d = {};
            if ($('.type_img_1').attr("src") == 'img/sfzzm.png') {
                alert("请上传身份证正面照");
            } else if ($('.type_img_2').attr("src") == 'img/sfzfm.png') {
                alert("请上传身份证反面照");
            } else {
                d.token = token;
                d.method = "yeepay_reg";
                d.type_1 = $('.type_img_1').attr("src");
                d.type_2 = $('.type_img_2').attr("src");
                // d.type_3 = $('.type_img_3').attr("src");
                // d.type_4 = $('.type_img_4').attr("src");
                $.ajax({
                    type: "post",
                    url: "http://www.rice.com/app/api/h5_access",
                    data: d,
                    dataType: "json",
                    success: function (result) {
                        if (result.status == "1") {
                            alert(result.message);
                            location.href = "home.html";
                        } else {
                            alert(result.message);
                        }
                    }
                })
            }

        })
    </script>

</body>

</html>